<template>
    <div class="Out">
        <div><el-button icon="el-icon-back" @click="back" style="background-color: #d6f1ea;color: #0103af;font-weight:bold ">返回</el-button></div>
        <div class="titleStyle"><strong>{{KnowledgeById.title}}</strong></div>
        <el-divider></el-divider>
        <div style="background-color: #d6f1ea;height: 50px"></div>
        <div class="articleStyle">
            {{KnowledgeById.article}}
        </div>
        <div style="background-color: #d6f1ea;height: 400px"></div>
    </div>

</template>
d6f1ea
<script>
    export default {
        name: "KnowledgeDetail",
        data(){
            return{
                KnowledgeById:{id:"",title:"",article: ""},
            }
        },
        /*接收跳转时传递的参数*/
       /* mounted: function() {
            this.KnowledgeById.id = this.$route.query.Id
        },*/
        created() {
            /*接收跳转时传递的参数*/
            this.KnowledgeById.id = this.$route.query.Id
            this.getKnowledgeById()
        },
        methods: {
            back(){
                /*this.$router.push("/prevent/story")*/
                this.$router.go(-1);
            },
            async getKnowledgeById() {
                console.log("id"+this.KnowledgeById.id)
                const {data: res} = await this.$http.get("getKnowledgeById?id="+this.KnowledgeById.id);
                console.log(res);
                this.KnowledgeById = res;
            },
        }
    }
</script>

<style scoped>
    .Out{
        height: 100%;
        background-color: #d6f1ea;
    }
    .titleStyle{
        display:flex;
        align-items:center;
        justify-content:center;
        font-size: 35px;
    }
    .articleStyle{
        display: flex;
        width:500px;
        margin: 0 auto;
        font-size: 23px;
        /*加粗字体*/
    }
</style>